<!-- 187 form -->
<template>
  <el-dialog :class="'el-dialog-theme3'" v-model="isShowPTDialog" fullscreen
    class="ptDialog roll-dialog pub_dialog" width="90%" @close="PTDialogClose" title="新增/编辑检测点位" top="1vh" draggable
    :close-on-click-modal="false" align-center>
    <div class="org">
      <!-- 左侧区域 -->
      <el-card class="leftCard left">
        <el-form :model="form" label-width="90px" ref="addPointRef" :rules="rules">
          <el-row>
            <el-col :span="12">
              <el-form-item label="检测类型：" prop="jclbId">
                <el-select v-model="form.jclbId" @change="getPointPropertys" style="width: 100%" filterable clearable>
                  <el-option v-for="item in jclbTypeList" :key="item.jclbId"
                    :label="`${item.jclbName}-${item.jclbGroupName}`" :value="item.jclbId" />
                </el-select>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="点位属性：" prop="property">
                <el-select clearable v-model="form.propertyId" style="width: 100%">
                  <el-option v-for="item in pointPropertyOptions" :key="item.propetyId" :label="item.propertyName"
                    :value="item.propetyId" />
                </el-select>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="24">
              <el-form-item label="点位名称：" prop="pointName">
                <el-input clearable type="textarea" v-model="form.pointName" placeholder="请输入点位名称" maxlength="100" />
              </el-form-item>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="12">
              <el-form-item label="周期类型：" prop="cycleType">
                <el-select clearable v-model="form.cycleType" @change="cycleTypeChange">
                  <el-option v-for="dict in sys_point_cycle" :key="dict.value" :label="dict.label"
                    :value="parseInt(dict.value)" />
                </el-select>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="周期次数：" prop="cycleCount">
                <el-input clearable v-model="form.cycleCount" type="number" placeholder="周期次数" maxlength="100" />
              </el-form-item>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="12">
              <el-form-item label="采样方式：">
                <el-select clearable v-model="form.sampleType" style="width: 100%">
                  <el-option v-for="dict in sys_sample_type" :key="dict.value" :label="dict.label"
                    :value="parseInt(dict.value)" />
                </el-select>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="排序号：" prop="orderId">
                <el-input-number clearable v-model="form.orderId" placeholder="排序号" maxlength="100" :min="1"
                  style="width: 100%" controls-position="right" />
              </el-form-item>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="12">
              <el-form-item label="采样天数：" prop="sampleDay">
                <el-input-number clearable v-model="form.sampleDay" :min="1" placeholder="天" style="width: 100%;"
                  controls-position="right" />
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="每天频次：" prop="sampleCount">
                <el-input-number clearable v-model="form.sampleCount" :min="1" placeholder="次" style="width: 100%;"
                  controls-position="right" />
              </el-form-item>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="12">
              <el-form-item label="东经（度）：" prop="jd">
                <el-input clearable v-model="form.jd" placeholder="经度" maxlength="100">
                  <template #suffix>
                    <el-icon class="el-input__icon" @click="editJdClick('addPoint')">
                      <Edit />
                    </el-icon>
                  </template>
                </el-input>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="北纬（度）：" prop="wd">
                <el-input clearable v-model="form.wd" placeholder="纬度" maxlength="100">
                  <template #suffix>
                    <el-icon class="el-input__icon" @click="editWdClick('addPoint')">
                      <Edit />
                    </el-icon>
                  </template>
                </el-input>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="12">
              <el-form-item label="点位编号：" prop="pointCode">
                <el-input clearable v-model="form.pointCode" placeholder="请输入点位编号" maxlength="100">
                </el-input>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="24">
              <el-form-item label="备注：" prop="remark">
                <el-input clearable type="textarea" v-model.trim="form.remark" placeholder="请输入备注" maxlength="500" />
              </el-form-item>
            </el-col>
          </el-row>
          <el-row style="margin-bottom: 15px">
            <el-col :span="24" style="text-align: center">
              <el-button type="success" @click="submitBtnClick">保存</el-button>
            </el-col>
          </el-row>
          <!-- 分包信息 -->
          <div>
            <el-row style="margin-bottom: 5px">
              <el-col :span="22">
                <p class="pinformation">分包信息</p>
              </el-col>
            </el-row>

            <el-row :gutter="20">
              <el-col :span="24">
                <el-form-item label="是否分包：" prop="isPackage">
                  <el-radio-group v-model="jcxmForm.isPackage" @change="onPackageChange">
                    <el-radio label="0">不分包</el-radio>
                    <el-radio label="1">分包采样</el-radio>
                    <el-radio label="2">分包不采样</el-radio>
                  </el-radio-group>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row :gutter="20">
              <el-col :span="24" v-show="togglePackage">
                <el-form-item label="分包公司：">
                  <!-- <el-form-item label="分包公司：" :rules="{
                  required: togglePackage,
                  message: '分包公司不能为空',
                  trigger: 'blur',
                }"> -->
                  <el-select v-model="jcxmForm.packageId" clearable placeholder="请选择分包公司" filterable style="width: 100%"
                    @change="packageChange">
                    <el-option v-for="item in packageList" :key="item.packageId" :label="item.packageName"
                      :value="item.packageId" />
                  </el-select>
                </el-form-item>
              </el-col>
            </el-row>
          </div>
          <!-- /分包信息 -->

          <!-- 复制已有点位检测项目 -->
          <!-- <el-row style="margin-bottom: 5px">
            <el-col :span="22">
              <p class="pinformation">复制已有点位检测项目</p>
            </el-col>
          </el-row>
          <el-row :gutter="35">
            <el-col :span="18">
              <el-form-item label="选择点位：">
                <el-select
                  v-model="targetPointId"
                  clearable
                  placeholder="请输入点位名称"
                  maxlength="100"
                >
                  <el-option
                    v-for="item in copyPointList"
                    :key="item.pointId"
                    :label="item.pointName"
                    :value="item.pointId"
                  />
                </el-select>
              </el-form-item>
            </el-col>
            <el-col :span="6" style="margin-top: 1px">
              <el-button
                type="success"
                @click="coptyJcxmList"
                :disabled="isCopy"
                >复制</el-button
              >
            </el-col>
          </el-row> -->
          <!-- /复制已有点位检测项目 -->

          <!-- 文字识别 -->
          <el-row style="margin-bottom: 5px">
            <el-col :span="24">
              <p class="pinformation">文字识别</p>
            </el-col>
          </el-row>
          <el-row style="margin-bottom: 5px">
            <el-col :span="20">
              <span style="font-size: 10px; color: #71730b">注：识别后使用机构默认常用方法，检测项目间用、分隔。</span>
            </el-col>
          </el-row>
          <el-row>
            <el-col>
              <el-form-item label="输入文字：">
                <el-input clearable type="textarea" :rows="4" v-model="form.text" resize="none" maxlength="200" />
              </el-form-item>
            </el-col>
          </el-row>
          <el-row style="margin-bottom: 5px">
            <el-col :span="24" style="text-align: right">
              <el-button type="success" @click="handleIdentify">识别</el-button>&nbsp;&nbsp;&nbsp;&nbsp;
            </el-col>
          </el-row>
          <!-- /文字识别 -->
        </el-form>
      </el-card>
      <!-- /左侧区域 -->

      <!-- 右侧区域 -->
      <div class="rightCard right">
        <el-card style="margin-bottom: 0.75 height: 100% !important;">
          <!-- <el-row justify="end">
						<el-button type="success" size="small" @click="submitBtnClick">保存</el-button>
														</el-row> -->
          <el-tabs v-model="jcxmTabName" @tab-change="jcxmTabChange">
            <!-- 检测项目 -->
            <el-tab-pane label="检测项目" name="first">
              <selectJcxm ref="jcxmRef" :params="jcxmForm" :jclbList="jclbTypeList" @setJcxmCount="setJcxmCount"
                @pointMove="pointMove" @isAutoSave="isAutoSave" v-if="jcxmTabName == 'first' && !isCopy" />
              <span v-if="isCopy" style="color: red; font-size: 18px">复制点位操作时请先点击”保存“按钮！</span>
            </el-tab-pane>
            <!-- /检测项目 -->

            <!-- 项目方法包 -->
            <el-tab-pane label="项目方法包" name="second" :disabled="isCopy || !form.pointId">
              <selectJcxmPackage ref="jcxmPackageRef" :params="jcxmForm" @setJcxmCount="setJcxmCount"
                @pointMove="pointMove" v-if="jcxmTabName == 'second'" />
            </el-tab-pane>
            <!-- /项目方法包 -->

            <!-- 检测项目组 -->
            <el-tab-pane label="检测项目组" name="third" :disabled="isCopy || !form.pointId">
              <selectJcxmGroup ref="jcxmGroupRef" :params="jcxmForm" @setJcxmCount="setJcxmCount" @pointMove="pointMove"
                v-if="jcxmTabName == 'third'" />
            </el-tab-pane>
            <!-- /检测项目组 -->
          </el-tabs>
        </el-card>
        <el-dialog :class="'el-dialog-theme3'" v-model="jdDialog" title="修改经度" width="20%" draggable
          :close-on-click-modal="false">
          <el-form-item label="经度：">
            <el-row>
              <el-col :span="6">
                <el-input placeholder="度" maxlength="100" clearable v-model="jwdForm.degrees" />
              </el-col>
              <el-col :span="2" style="text-align: center"> 度 </el-col>
              <el-col :span="6">
                <el-input v-model="jwdForm.minutes" placeholder="分" maxlength="100" clearable />
              </el-col>
              <el-col :span="2" style="text-align: center"> 分 </el-col>
              <el-col :span="6">
                <el-input v-model="jwdForm.seconds" placeholder="秒" maxlength="100" clearable />
              </el-col>
              <el-col :span="2" style="text-align: center"> 秒 </el-col>
            </el-row>
          </el-form-item>
          <template #footer>
            <el-button type="success" @click="jdSave"> 保存 </el-button>
            <el-button @click="jdDialog = false" type="danger">取消</el-button>
          </template>
        </el-dialog>
        <el-dialog :class="'el-dialog-theme3'" v-model="wdDialog" title="修改纬度" width="20%" draggable
          :close-on-click-modal="false">
          <el-form-item label="纬度：" prop="deviceName">
            <el-row>
              <el-col :span="6">
                <el-input placeholder="纬度" maxlength="100" clearable v-model="jwdForm.degrees" />
              </el-col>
              <el-col :span="2" style="text-align: center"> 度 </el-col>
              <el-col :span="6">
                <el-input v-model="jwdForm.minutes" placeholder="分" maxlength="100" clearable />
              </el-col>
              <el-col :span="2" style="text-align: center"> 分 </el-col>
              <el-col :span="6">
                <el-input v-model="jwdForm.seconds" placeholder="秒" maxlength="100" clearable />
              </el-col>
              <el-col :span="2" style="text-align: center"> 秒 </el-col>
            </el-row>
          </el-form-item>
          <template #footer>
            <el-button type="success" @click="wdSave"> 保存 </el-button>
            <el-button @click="wdDialog = false" type="danger">取消</el-button>
          </template>
        </el-dialog>
      </div>
      <!-- /右侧区域 -->
    </div>

    <div id="openSelJcxmDialog" v-if="!isCopy" style="
        position: absolute;
        border-width: 0px;
        border-radius: 4px;
        right: 8px;
        top: 25%;
        z-index: 999;
        cursor: pointer;
      ">
      <span style="
          background-color: #ff5027;
          color: white;
          position: absolute;
          left: -15px;
          top: -4px;
          border-radius: 11px;
          padding: 0 8px;
          height: 18px;
          line-height: 18px;
          font-size: 12px;
          word-break: normal;
        ">
        <span style="margin: 0 -2px; position: relative" id="selJcxmCount">{{
          form.jcxmCount
        }}</span>
      </span>
      <div class="hidTitle" @click="openTaskJcxm('taskJcxmOpen', 0)">
        <span>不分包检测项目</span>
      </div>
    </div>
    <div id="openSelJcxmDialog1" v-if="!isCopy" style="
        position: absolute;
        border-width: 0px;
        border-radius: 4px;
        right: 8px;
        top: 50%;
        z-index: 999;
        cursor: pointer;
      ">
      <span style="
          background-color: #ff5027;
          color: white;
          position: absolute;
          left: -15px;
          top: -4px;
          border-radius: 11px;
          padding: 0 8px;
          height: 18px;
          line-height: 18px;
          font-size: 12px;
          word-break: normal;
        ">
        <span style="margin: 0 -2px; position: relative" id="selJcxmCount">{{
          form.jcxmPCount
        }}</span>
      </span>
      <div class="hidTitle" @click="openTaskJcxm('taskJcxmPackageOpen', 3)">
        <span>分包检测项目</span>
      </div>
    </div>
    <svg-icon icon-class="shixinhongdian" id="point_move" v-show="point_show" style="
        font-size: 35px;
        left: 100px;
        top: 0px;
        position: absolute;
        z-index: 9999;
      " />
    <taskJcxm ref="taskJcxmRef" :params="taskJcxmParams" @setJcxmCount="setJcxmCount"
      @callbackSetPjName="callbackSetPjName" />
  </el-dialog>
</template>

<script setup>
import { allListJclb, getSxJclb } from "@/api/store/jclb";
import { addPoint } from "@/api/contract/custom";
import {
  getPoint,
  deleteSelectedAllJcxm,
  listPoint1,
  copyTaskJcxmList,
  getOrderId,
  getpackage,
  jcxmIdentify,
} from "@/api/contract/taskPoint";
import { getLatiAndLong, getDms } from "@/api/common";
import $ from "jquery";
import selectJcxm from "./selectJcxm";
import selectJcxmPackage from "./selectJcxmPackage";
import selectJcxmGroup from "./selectJcxmGroup";
import taskJcxm from "./taskJcxm";
import { ElMessageBox } from "element-plus";

const { proxy } = getCurrentInstance();
const pointPropertyOptions = ref([]);
const jcxmTable = ref([]); // 检测项目组 => 检测项目表格
const methodTable = ref([]); // 项目方法包 => 检测项目表格
const highLightRow = ref(true); // 表格选中高亮样式
const jcxmTabName = ref("first"); // 选项卡默认选中
const jclbTypeList = ref([]); // 检测类别列表
const { sys_point_cycle, sys_sample_type } = proxy.useDict(
  "sys_point_cycle",
  "sys_sample_type"
);
const isShowPTDialog = ref(false); // 控制dialog开启/关闭
const isCopy = ref(false);
const point_show = ref(false);
const copyPointList = ref([]);
const targetPointId = ref();
const emit = defineEmits(["destroyPointDialog"]);

// 接受父组件传递过来的数据
const props = defineProps({
  // 是否显示提示
  pointId: {
    type: String,
  },
  // 父组件中的方法
  queryPointList: {
    type: Function,
  },
  primaryKeyId: {
    type: String,
  },
});
watch(
  () => props.pointId,
  () => {
    if (props.pointId) {
      getPoint(props.pointId).then((res) => {
        form.value = res.data;
        jcxmTabChange();
        //查询当前检测类别关联的点位属性列表。
        getPointPropertys(form.value.jclbId, true);
        selectPointList();
      });
    }
  }
);

const data = reactive({
  form: {
    jcxmCount: 0,
    jcxmPCount: 0,
    sampleType: 1,
  },
  jcxmForm: {
    isPackage: "0",
  },
  taskJcxmParams: {},
  rules: {
    jclbId: [
      { required: true, message: "检测类型不能为空", trigger: "change" },
    ],
    pointName: [
      { required: true, message: "点位名称不能为空", trigger: "blur" },
    ],
    orderId: [{ required: true, message: "排序号不能为空", trigger: "blur" }],
    sampleDay: [
      { required: true, message: "采样天数不能为空", trigger: "blur" },
    ],
    // isPackage: [
    // 	{ required: true, message: "请选择是否分包", trigger: "blur" }
    // ],
    sampleCount: [
      { required: true, message: "采样频次不能为空", trigger: "blur" },
    ],
    // isCollect: [
    // 	{ required: true, message: "请选择是否采样", trigger: "blur" }
    // ],
    cycleType: [
      { required: true, message: "周期类型不能为空", trigger: "change" },
    ],
    cycleCount: [
      { required: true, message: "周期次数不能为空", trigger: "blur" },
    ],
    jd: [
      {
        pattern:
          /^(((\d|[1-9]\d|1[1-7]\d|0)\.\d{0,6})|(\d|[1-9]\d|1[1-7]\d|0{1,3})|180\.0{0,6}|180)$/,
        message: "输入错误",
        trigger: "blur",
      },
    ],
    wd: [
      {
        pattern: /^([0-8]?\d{1}\.\d{0,6}|90\.0{0,6}|[0-8]?\d{1}|90)$/,
        message: "输入错误",
        trigger: "blur",
      },
    ],
  },
});

const { form, rules, jcxmForm, taskJcxmParams } = toRefs(data);
const oldFormJclbId = ref();

watch(
  () => form.value.jclbId,
  (newVal, oldVal) => {
    if (!form.value.pointId || !oldVal) return;
    if (form.value.jcxmPCount != 0 || form.value.jcxmCount != 0) {
      oldFormJclbId.value = oldVal;
    }
  }
);

// 重置新增点位表单
const resetForm = () => {
  nextTick(() => {
    form.value = {
      jcxmCount: 0,
      jcxmPCount: 0,
    };
    proxy.$refs["addPointRef"]?.resetFields();
  });
};

// 是否分包 => 显示隐藏
const togglePackage = ref(false);
const onPackageChange = (value) => {
  if (value == "1" || value == "2") {
    togglePackage.value = true;
  } else {
    togglePackage.value = false;
  }
};
// 对外暴露以下方法或变量
defineExpose({
  isShowPTDialog,
  isCopy,
  form,
  resetForm,
});

// 获取检测类别列表
getJclbTypeList();

/**
 * 设置提交检测项目时的固定参数
 */
function setJcxmFormData() {
  jcxmForm.value.pointJclbId = form.value.jclbId;
  jcxmForm.value.pointId = form.value.pointId;
  jcxmForm.value.sampleDay = form.value.sampleDay;
  jcxmForm.value.sampleCount = form.value.sampleCount;
}
// 获取检测类别数据
function getJclbTypeList() {
  allListJclb().then((res) => {
    jclbTypeList.value = res.data;
  });
}

// 多选框选中数据
async function setJcxmCount(data) {
  Object.assign(form.value, data);
}

/** 修改按钮操作 */
async function rowClick() {
  highLightRow.value = true;
}

// 自适应高度
const heightParams = ref([
  { tableName: "main", bottomHeight: 85 },
  { tableName: "sub", bottomHeight: 35 },
  { tableName: "sub1", bottomHeight: 35 },
  { tableName: "sub2", bottomHeight: 35 },
  { tableName: "sub3", bottomHeight: 35 },
  { tableName: "sub5", bottomHeight: 100 },
  { tableName: "sub7", bottomHeight: 300 },
]);

function getHeight() {
  proxy.adaptiveHeight(proxy, heightParams.value);
}

onMounted(() => {
  nextTick(function () {
    getHeight();
    window.addEventListener("resize", getHeight);
  });
})

onUpdated(() => {
  nextTick(function () {
    getHeight();
  });
});

onBeforeUnmount(async () => {
  window.removeEventListener("resize", getHeight);
});

//根据检测类别id获取点位属性列表。
function getPointPropertys(jclbId, firstLoad) {
  if (!firstLoad) {
    form.value.sampleDay = 1;
    form.value.sampleCount = 1;
  }
  console.log(props.pointId, props.primaryKeyId);
  pointPropertyOptions.value = [];
  delete form.pointProperty;
  getSxJclb({ jclbId: jclbId }).then((res) => {
    if (res.data) pointPropertyOptions.value = res.data;
  });
  if (!firstLoad) {
    validateJclbIsChange(jclbId);
  }
  // form.value.orderId
  if (!props.pointId) {
    getOrderId({ jclbId: jclbId, primaryId: props.primaryKeyId }).then(
      (res) => {
        form.value.orderId = res.data;
      }
    );
  }
}

function validateJclbIsChange(jclbId) {
  if (form.value.jcxmPCount != 0 || form.value.jcxmCount != 0) {
    proxy.$modal
      .confirm("改变检测类别将会删除添加的检测项目，确定要继续吗？")
      .then((res) => {
        proxy.$refs["addPointRef"].validate((valid) => {
          if (!valid) {
            form.value.jclbId = oldFormJclbId.value;
            return false;
          }
          selectPointList();
          handleDeleteTaskJcxm().then(() => {
            submitBtnClick(true);
          });
        });
      })
      .catch(() => {
        form.value.jclbId = oldFormJclbId.value;
      });
  } else if (form.value.pointId) {
    submitBtnClick(true);
  }
}

// 保存按钮 => 点击
const submitBtnClick = (isAuto, isReach) => {
  return new Promise((resolve, reject) => {
    if (form.value.jclbId == "1658880734024134621" && !form.value.pointCode) {
      proxy.$modal.msgError("点位编号不能为空！")
      return
    }
    proxy.$refs["addPointRef"].validate(async (valid) => {
      if (!valid) return false;
      await addPoint(form.value).then((res) => {
        if (!isAuto || typeof isAuto != "boolean") {
          if (form.value.pointId) {
            if (isCopy.value) {
              isCopy.value = false;
              proxy.$modal.msgSuccess("复制的点位保存成功！");
            } else {
              proxy.$modal.msgSuccess("编辑成功");
            }
          } else {
            form.value.pointId = res.data;
            proxy.$modal.msgSuccess("新增成功");
            selectPointList();
          }
        }
        resolve();
        if (isReach == 2) {
          return
        }
        jcxmTabChange();
      });
    });
  });
};

// 选项卡切换
function jcxmTabChange() {
  let tabName = jcxmTabName.value;
  setJcxmFormData();
  if (tabName == "first" && !isCopy.value) {
    nextTick(() => {
      proxy.$refs["jcxmRef"].setFormParams(jcxmForm.value);
    });
  } else if (tabName == "second") {
    nextTick(() => {
      proxy.$refs["jcxmPackageRef"].setFormParams(jcxmForm.value);
    });
  } else if (tabName == "third") {
    nextTick(() => {
      proxy.$refs["jcxmGroupRef"].setFormParams(jcxmForm.value);
    });
  }
}

// 点击dialog右上角x号关闭
const PTDialogClose = () => {
  setTimeout(() => {
    emit("destroyPointDialog");
  }, 300);
  if (form.value.primaryId) props.queryPointList(form.value.primaryId);
};

//打开已添加的检测项目窗口（不分包）
function openTaskJcxm(openName, isPackage) {
  if (form.value.pointId) {
    taskJcxmParams.value.pjName = form.value.pjName;
    taskJcxmParams.value.pointId = form.value.pointId;
    taskJcxmParams.value.isPackage = isPackage;
    proxy.$refs["taskJcxmRef"].show(openName, 1);
  } else {
    proxy.$refs["taskJcxmRef"].show(openName);
  }
}

function callbackSetPjName(pjName) {
  form.value.pjName = pjName;
}

//圆点轨迹
function pointMove(obj, target) {
  var startXy = getOffset(obj);
  if (!target) target = $("#openSelJcxmDialog1");
  var targetXy = getOffset(target[0]);
  var x1 = targetXy.x - startXy.x;
  var y1 = targetXy.y - startXy.y;
  var a = targetXy.x - 60,
    b = startXy.y - 30;
  var body = document.getElementsByTagName("body")[0];
  var timer = null;
  var times = 44;
  var pointObj = $("#point_move")[0];
  try {
    point_show.value = true;
    timer = setInterval(function () {
      try {
        if (times <= 30) {
          clearInterval(timer);
          point_show.value = false;
        }
        var hudu = 6 * (Math.PI / 180) * times;

        var x = a + Math.sin(hudu) * x1;

        var y = b - Math.cos(hudu) * y1; //  注意此处是“-”号，因为我们要得到的Y是相对于（0,0）而言的。
        pointObj.style.left = x + "px";
        pointObj.style.top = y + "px";
        times--;
      } catch (e) {
        clearInterval(timer);
      }
    }, 50);
  } catch (e) {
    clearInterval(timer);
    point_show.value = false;
  }
}
//获取指定元素的位置
function getOffset(el) {
  el = el.getBoundingClientRect();
  return {
    x: el.left + window.scrollX,
    y: el.top + window.scrollY,
  };
}

// open全部删除
function handleDeleteTaskJcxm() {
  return new Promise((resolve) => {
    if (!form.value.pointId) return Promise.reject(false);
    deleteSelectedAllJcxm({ pointId: form.value.pointId }).then((res) => {
      proxy.$modal.msgSuccess("删除成功");
      let data = {
        jcxmCount: res.data.jcxmCount,
        jcxmPCount: res.data.jcxmPCount,
      };
      setJcxmCount(data);
      resolve();
    });
  });
}

function editJdClick(name) {
  proxy.$refs[name + "Ref"].validateField("jd", (isOpen) => {
    if (isOpen) {
      jdDialog.value = true;
      if (form.value.jd) {
        getDms({ jd: form.value.jd }).then((res) => {
          jwdForm.value = res.data;
        });
      } else {
        jwdForm.value = {};
      }
    }
  });
}
function editWdClick(name) {
  proxy.$refs[name + "Ref"].validateField("wd", (isOpen) => {
    if (isOpen) {
      wdDialog.value = true;
      if (form.value.wd) {
        getDms({ wd: form.value.wd }).then((res) => {
          jwdForm.value = res.data;
        });
      } else {
        jwdForm.value = {};
      }
    }
  });
}

const jwdForm = ref({});
const jdDialog = ref(false);
const wdDialog = ref(false);
function jdSave() {
  if (
    !jwdForm.value.degrees &&
    !jwdForm.value.minutes &&
    !jwdForm.value.seconds
  ) {
    proxy.$modal.msgError("请填写完整的经度");
  } else {
    getLatiAndLong(jwdForm.value).then((res) => {
      form.value.jd = res.data;
      jdDialog.value = false;
    });
  }
}

function wdSave() {
  if (
    !jwdForm.value.degrees &&
    !jwdForm.value.minutes &&
    !jwdForm.value.seconds
  ) {
    proxy.$modal.msgError("请填写完整的纬度");
  } else {
    getLatiAndLong(jwdForm.value).then((res) => {
      form.value.wd = res.data;
      wdDialog.value = false;
    });
  }
}

function isAutoSave(val) {
  submitBtnClick();
}

function selectPointList() {
  let params = {};
  if (form.value.pointId) {
    params.notPointId = form.value.pointId;
    params.jclbId = form.value.jclbId;
    params.primaryId = form.value.primaryId;
  }
  listPoint1(params).then((res) => {
    copyPointList.value = res.data;
  });
}

function coptyJcxmList() {
  if (!targetPointId.value) {
    proxy.$modal.msgError("请选择要复制的检测点位！");
    return;
  }
  copyTaskJcxmList(targetPointId.value, form.value.pointId).then((res) => {
    proxy.$modal.msgSuccess("复制成功");
    let data = {
      jcxmCount: res.data.jcxmCount,
      jcxmPCount: res.data.jcxmPCount,
    };
    setJcxmCount(data);
    jcxmTabChange();
  });
}

function cycleTypeChange(val) {
  if (val == 1) {
    if (!form.value.cycleCount) {
      form.value.cycleCount = val;
    }
  }
}

const packageList = ref([]);
getpackage().then((res) => {
  packageList.value = res.data;
});

function packageChange(val) {
  if (val) {
    jcxmForm.value.packageName = proxy.getItemByArray(
      packageList.value,
      "packageId",
      val,
      "packageName"
    );
  } else {
    jcxmForm.value.packageName = "";
  }
}

function handleIdentify() {
  submitBtnClick(true, 2).then((resp) => {
    const temp = {
      text: form.value.text,
      jclbId: form.value.jclbId,
      pointId: form.value.pointId,
      sampleDay: form.value.sampleDay,
      sampleCount: form.value.sampleCount,
      isPackage: jcxmForm.value.isPackage,
      packageId: jcxmForm.value.packageId,
      packageName: jcxmForm.value.packageName,
      isMethod: "0",
    };
    jcxmIdentify(temp)
      .then((res) => {
        if (res.data.errorMsg) {
          ElMessageBox.alert(res.data.errorMsg, "错误", {
            confirmButtonText: "确定",
            type: "error",
          });
          return;
        }
        ElMessageBox.alert(res.data.successMsg, "成功", {
          confirmButtonText: "确定",
          type: "success",
        });
        let data = {
          jcxmCount: res.data.jcxmCount,
          jcxmPCount: res.data.jcxmPCount,
        }
        setJcxmCount(data);
        proxy.$refs["jcxmRef"]?.reselection();
        proxy.$refs["jcxmPackageRef"]?.reselection();
        proxy.$refs["jcxmGroupRef"]?.reselection();
      })
  });
}
</script>

<style lang="scss" scoped>
sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}

sup {
  top: -0.5em;
}

sub {
  bottom: -0.25em;
}

.left {
  width: 30%;
  min-height: 80vh !important;
}

.right {
  width: 70%;
  /* height: 100%; */
}

.el-card {
  height: 100%;
}

.change {
  display: flex;
  justify-content: center;
}

.el-table--fit {
  height: auto !important;
}

:deep(.el-dialog__body) {
  padding: 5px !important;
}

.clearStyle.el-form-item {
  margin-bottom: 0 !important;
}

.paginationBox {
  display: flex;
  justify-content: center;
  margin-top: 20px;
}

/*隐藏菜单后的样式*/
.hidTitle {
  padding-top: 10px;
  padding-bottom: 5px;
  background-color: #67c23a;
  color: white;
  border-radius: 8px 8px 8px 8px;
  width: 25px;
  line-height: 22px;
  padding-left: 6px;
  border-right: 1px solid #49afcd;
  font-size: 13px;
  float: left;
}
</style>
